<template>
  <!--
    	作者：4948286@qq.com
    	时间：2019-11-36
    	描述：添加图片类型
    -->
  <el-dialog
    title="添加分类"
    :visible.sync="dialogVisible"
    width="30%"
    :before-close="handleClose" :append-to-body="true">
    <el-form size="small" :model="form" ref="form" label-width="100px" class="demo-ruleForm">
      <el-form-item
        label="分类名称"
        prop="categoryname"
        :rules="[
          { required: true, message: '名字不能为空'}
        ]"
      >
        <el-input type="age" v-model="form.categoryname" autocomplete="off"></el-input>
      </el-form-item>
      <el-form-item
        label="排序"
        prop="sort">
        <el-input type="number" v-model="form.sort" autocomplete="off"></el-input>
      </el-form-item>
      <el-form-item>
        <el-button size="small" @click="handleClose">取消</el-button>
        <el-button size="small" type="primary" @click="submitForm('form')">提交</el-button>
      </el-form-item>
    </el-form>

  </el-dialog>
</template>

<script>
import SysUploadApi from '@/api/sysupload.js';
export default {
  data(){
    return {
      /*是否显示*/
      dialogVisible:true,
      /*from表单模型*/
      form:{
        categoryname:'',
        sort:0
      },
      /*分类名称*/
      categoryName:''
    }
  },
  props:['category'],
  created() {
    if(this.category!=null){
      this.form.categoryname=this.category.groupName;
      this.form.group_id=this.category.groupId
      this.form.sort=this.category.sort
    }
  },
  methods:{

    /*添加图片类别*/
    addCategory: function(categoryname,sort) {
      let self = this;
      SysUploadApi.addCategory({groupName: categoryname,sort:sort},).then(data => {
          self.$message({
            message: '添加成功',
            type: 'success'
          });
          self.handleClose({status:'success'});
        })
        .catch(error => {
          self.$message.error('添加失败');
        });
    },

    /*修改图片类别*/
    editCategory: function(model) {
      let self = this;
      let param={
        groupName: model.categoryname,
        groupId:model.group_id,
        sort:model.sort
      };
      SysUploadApi.updateCategory(param,true).then(data => {
          self.$message({
            message: '修改成功',
            type: 'success'
          });
          self.handleClose({status:'success'});
        })
        .catch(error => {
          self.$message.error('修改失败');
        });
    },

    /*提交*/
    submitForm(formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          if(this.category&&this.category.groupId!=null){
            this.editCategory(this.form);
          }else{
            this.addCategory(this.form.categoryname,this.form.sort);
          }
        } else {
          console.log('error submit!!');
          return false;
        }
      });
    },


    /*关闭弹窗*/
    handleClose(param){
      this.dialogVisible=false;
      this.$emit('closeCategory',param);
    }
  }

}

</script>

<style>
</style>
